<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <!-- 这是个iphone设备中的safari私有meta标签，它表示：允许全屏模式浏览；-->
    <meta content="yes" name="apple-mobile-web-app-capable">
    <!-- 全屏显示-->
    <meta name="apple-touch-fullscreen" content="yes">
    <!-- 不要让设备识别电话号码和邮箱地址-->
    <meta content="telephone=no,email=no" name="format-detection">
    <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
    <meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no" id="viewport" name="viewport">
    <!-- DNS预解析-->
    <meta http-equiv="x-dns-prefetch-control" content="on">
    <link href="../css/common/reset.css" rel="stylesheet">
    <link href="../css/common/common.css" rel="stylesheet">
    <link href="../css/animate.css" rel="stylesheet">
    <link href="../css/jf-info.css" rel="stylesheet">
    <link href="../css/video-share.css" rel="stylesheet">

  <link href="../css/video.css" rel="stylesheet">





    <title>直播分享</title>    
  </head>
  <body>
<!--     <video id="my_video_1" class="video-js vjs-default-skin" controls preload="auto" data-setup='{}'>
        <source src="../src/z.m3u8" type="application/x-mpegURL">
    </video> -->
    <div class="vide-share videobox">
        <video id="my_video_1" class="video-js vjs-default-skin" controls preload="auto" data-setup='{}'>
            <source :src="kk.url" type="application/x-mpegURL">
        </video>
          <div class="videobox">
            <div id="J_prismPlayer" class="prism-player"></div>
            <span class="num">{{kk.count}}</span>
        </div>


        <div class="anchor">
            <h4>主播介绍</h4>
            <ul>
                <li class="tit">
                    <img :src="kk.cookPicture" alt="">
                    <p>
                        <strong>{{kk.name}}</strong><br/>
                        <em>{{kk.topic}}</em>
                    </p>
                </li>
                <li class="introduct">{{kk.desc}}</li>
            </ul>
        </div>
    </div>
    


    <script>
        function setFontSize(){
            document.documentElement.style.fontSize = document.documentElement.clientWidth/375*10+"px";
        }
        setFontSize();
        window.onresize = function(){
            setFontSize();
                
        };
    </script>
    <script src="../js/vue.min.js"></script>
    <script src="../js/vue-resource1.3.4.js"></script>
    <script>


        var vm = new Vue({
            el: '.vide-share',
            data:{
              kk:{}
            },
            created:function(){
                var $this = this;
                this.$http.post('/fotile-api-0.0.2/video/detail',{"id":"1111"}).then(function(data){
                    var data = data.data;
                    if(data.status == 200){

                        $this.kk = data.data;
                        console.info($this.kk);


  

                    }
                    
                },function(){
                    console.info('error');
                });

            },
            updated:function(){
                console.info(11);
            },
            mounted:function(){
                //var myPlayer = neplayer("my-video");
                // var $this = this;
                // console.info();
                // function InitPlayer(){
                //     console.info($this.kk.url);
                //     var player = new prismplayer({
                //         id: "J_prismPlayer",    // 容器id
                //         source: 'http://lifevideo.fotile.com/fotilestyle/shanghai.m3u8',  // 视频url 支持互联网可直接访问的视频地址
                //         autoplay: true,       // 自动播放
                //         width: "100%",        // 播放器宽度
                //         height: "400px"      // 播放器高度
                //     });
                // }
                // InitPlayer();
            },methods:function(){

            }
        });

    </script>
  <script src="../js/video.js"></script>
  <script src="../js/videojs-live.js"></script>
  </body>
</html>